<template>
    <div>
        <div>
            <el-input v-model="QuickSearch" placeholder="请输入ID或名称进行快速查询" @keyup.enter.native="SearchChange()"
                style="width:50%;" clearable ref="searchinput"></el-input>
            <el-button type="primary" @click="SearchChange()">查询</el-button>
            <el-button v-if="multiple_choice" icon="el-icon-check" @click="btnSure()">确定</el-button>
            <el-button v-if="multiple_choice" icon="el-icon-close" @click="btnCancel()">取消</el-button>
        </div>
        <el-container style="height: 500px;border:1px solid #CCC">
            <el-aside width="150px">
                <el-menu class="emitem-nav" @select="handleclsSelect" :default-active="groupid">
                    <el-menu-item index="全部">全部</el-menu-item>
                    <el-menu-item :index="emitem.name" :key="index" v-for="(emitem, index) in clsMenus">{{ emitem.name
                    }}</el-menu-item>
                </el-menu>
            </el-aside>
            <el-container style="overflow: hidden;">
                <el-main style="overflow: hidden;">
                    <vxe-grid :columns="tableColumn" :display-pager="false" :sort-config="{ trigger: 'cell' }"
                        header-align="center" :pager-config="tablePage" :proxy-config="tableProxy" @cell-dblclick="vxselect"
                        border height="498px" highlight-current-row highlight-hover-row ref="ddlrptunitTable" resizable
                        size="mini" stripe>
                    </vxe-grid>
                </el-main>
            </el-container>
        </el-container>
    </div>
</template>
<script>
export default {
    props: {
        pfulldata: { type: Object, default: null },
        multiple_choice: { type: Boolean, default: false },
        prgno: { type: String },
        beforeChange: { type: Function },
        reporttype: { type: String }, //业务类型 10＝通用，20＝细菌，30＝图文，40=骨髓，90＝血库，50=PDF报告，60=基因报告
    },
    data() {
        return {
            selvalue: 0,
            groupid: "全部",
            clsMenus: [],
            fulldata: this.pfulldata,
            tableColumn: [],
            tableProxy: {
                index: true, // 启用动态序号代理
                // 配置响应的数据属性
                props: {
                    result: "data.result",
                    total: "data.page.total"
                },
                ajax: {
                    // page 对象： { pageSize, currentPage }
                    query: param => {
                        let _this = this;
                        return new Promise((s, f) => {
                            var collist = [];
                            try {
                                if (this.multiple_choice) {
                                    //多选模式
                                    collist = [
                                        {
                                            type: "selection",
                                            width: 40,
                                            align: "center"
                                        }
                                    ];
                                    for (let i = 0, len = this.fulldata.Cols.length; i < len; i++) {
                                        const item = this.fulldata.Cols[i];
                                        let colitem = {
                                            field: item.field,
                                            title: item.title,
                                            width: 200,
                                            sortable: true
                                        };
                                        collist.push(colitem);
                                    }
                                    this.tableColumn = collist;
                                } else {
                                    //单选模式
                                    for (let i = 0, len = this.fulldata.Cols.length; i < len; i++) {
                                        const item = this.fulldata.Cols[i];
                                        let colitem = {
                                            field: item.field,
                                            title: item.title,
                                            width: item.width,
                                            sortable: true
                                        };
                                        //if (i === 0) colitem.fixed = "left";
                                        collist.push(colitem);
                                    }
                                    this.tableColumn = collist;
                                }

                                //根据groupid过滤
                                let cData = this.fulldata.Data;
                                if (this.groupid != "全部") {
                                    cData = cData.filter(item => item.labgroupname === this.groupid);
                                }
                                if (this.QuickSearch) {
                                    cData = cData.filter(item => ((item.rptunitid + "").indexOf(this.QuickSearch) > -1 || item.rptunitname.indexOf(this.QuickSearch) > -1));
                                }
                                //分页
                                // var pagedData = cData.slice((param.page.currentPage - 1) * param.page.pageSize, param.page.currentPage * param.page.pageSize);
                                s({ data: { page: { total: cData.length }, result: cData } });
                            }
                            catch (er) {
                                s({ data: { page: { total: this.fulldata.Data.length }, result: this.fulldata.Data } });
                            }
                        });
                    }
                }
            },
            finallvalue: [],
            finallname: [],
            selectKey: 0,
            tablePage: {
                pageSize: 1000
            },
            QuickSearch: "",
        };
    },
    created() {
        this.loadAllData();
    },
    mounted() {
        this.$refs.searchinput.focus();
    },
    methods: {
        SearchChange() {
            this.groupid = "全部";
            let that = this;
            setTimeout(() => {
                that.$refs.ddlrptunitTable.commitProxy("query");
            }, 10);
        },
        handleclsSelect: function (key, keyPath) {
            this.groupid = key;
            if (this.multiple_choice) {
                this.SelectRecordsSet();
            }
            let that = this;
            setTimeout(() => {
                that.$refs.ddlrptunitTable.commitProxy("query").then(() => {
                    if (that.selvalue) {
                        if (that.selvalue.toString().indexOf(",") > 0) {
                            let ids = that.selvalue.toString().split(",");
                            let datas = that.fulldata.Data.filter(m => ids.indexOf(m.rptunitid.toString()) > -1);
                            if (datas && datas.length > 0) that.$refs.ddlrptunitTable.setSelection(datas, true);
                        } else {
                            let data = that.fulldata.Data.find(m => m.rptunitid == that.selvalue);
                            if (!!data) {
                                var drs = [];
                                drs.push(data);
                                if (that.multiple_choice) that.$refs.ddlrptunitTable.setSelection(drs, true);
                                that.$refs.ddlrptunitTable.setCurrentRow(data).then(() => {
                                    that.$refs.ddlrptunitTable.scrollToRow(data);
                                });
                            }
                        }
                    }
                });
            }, 10);
        },
        setCurrentValue: async function (v) {
            if (this.$refs.searchinput) this.$refs.searchinput.focus();
            this.selvalue = v;
            if (!this.fulldata) {
                await this.loadAllData();
            }
            if (this.selvalue) {
                if (this.selvalue.toString().indexOf(",") > 0) {
                    let ids = this.selvalue.toString().split(",");
                    let datas = this.fulldata.Data.filter(m => ids.indexOf(m.rptunitid.toString()) > -1);
                    // console.log("datas", datas);
                    if (datas && datas.length > 0) this.$refs.ddlrptunitTable.setSelection(datas, true);
                } else {
                    let data = this.fulldata.Data.find(m => m.rptunitid == this.selvalue);
                    if (!!data) this.groupid = data.labgroupname;
                    this.handleclsSelect(this.groupid, "");
                }
            } else {
                this.groupid = "全部";
                this.handleclsSelect(this.groupid, "");
            }
        },
        loadAllData: async function () {
            if (!this.fulldata || this.fulldata.Data.length == 0) {
                let res = await this.$tool.request({
                    url: "ucent/ddl",
                    method: "post",
                    data: {
                        action: "rptunit",
                        groupid: this.groupid,
                        prgno: this.prgno,
                        reporttype: this.reporttype,
                    }
                });
                this.fulldata = res.RData;
            }
            let clsArray = [];
            for (let i = 0; i < this.fulldata.Data.length; i++) {
                let cfData = this.fulldata.Data[i];
                if (
                    clsArray.find(x => {
                        return x.name === cfData.labgroupname;
                    }) == undefined
                ) {
                    let citem = { name: cfData.labgroupname, seq: cfData.seq2 };
                    clsArray.push(citem);
                }
            }
            clsArray.sort(function (a, b) {
                return a.seq - b.seq;
            });
            this.clsMenus = clsArray;
        },
        vxselect: async function (data, evt) {
            let myvalue = data.row.rptunitid;
            if (!this.multiple_choice) {
                let execflag = true;
                if (typeof this.beforeChange === "function") {
                    let r = await this.beforeChange(data.row.rptunitid);
                    if (!r) {
                        execflag = false;
                    }
                }
                if (execflag) {
                    this.$nextTick(() => {
                        this.$emit("change", myvalue, data.row.rptunitname);
                        this.$emit("changeObj", { code: myvalue, name: data.row.rptunitname, row: '' });
                    });
                }
            }
        },
        async btnSure() {
            this.SelectRecordsSet();
            var v = this.finallvalue.join(","); // this.finallvalue.substring(0, this.finallvalue.length - 1);
            var n = this.finallname.join(",");
            let execflag = true;
            if (typeof this.beforeChange === "function") {
                let r = await this.beforeChange(v);
                if (!r) {
                    execflag = false;
                }
            }
            if (execflag) {
                this.$nextTick(() => {
                    this.$emit("change", v, n);
                    this.$emit("changeObj", { code: v, name: n, row: '' });
                });
            }
        },
        btnCancel() {
            this.$emit("cancel");
        },
        SelectRecordsSet() {
            let data = this.$refs.ddlrptunitTable.getSelectRecords(); //当前页面选中的数据
            let rdata = this.$refs.ddlrptunitTable.tableData; //当前页面所有的数据
            let rptunitidarr = [];
            data.forEach(element => {
                rptunitidarr.push(element.rptunitid);
            });
            try {
                rdata.forEach(element => {
                    if (data.length > 0) {
                        //当前页面有勾选的项目
                        if (rptunitidarr.indexOf(element.rptunitid) > -1) {
                            //勾选的数据是当前数据
                            if (this.finallvalue.indexOf(element.rptunitid) < 0) {
                                this.finallvalue.push(element.rptunitid);
                                this.finallname.push(element.rptunitname);
                            }
                        } else {
                            if (this.finallvalue.indexOf(element.rptunitid) > -1) {
                                let index = this.finallvalue.indexOf(element.rptunitid);
                                this.finallvalue.splice(index, 1);
                                this.finallname.splice(index, 1);
                            }
                        }
                    } else {
                        //当前页面没有勾选的项目
                        if (this.finallvalue.indexOf(element.rptunitid) > -1) {
                            let index = this.finallvalue.indexOf(element.rptunitid);
                            //返回值的里面有则删除
                            this.finallvalue.splice(index, 1);
                            this.finallname.splice(index, 1);
                        }
                    }
                });
            } catch (e) { }
        }
    },
    mounted() { }
};
</script>
<style scoped>
.el-main {
    padding: 0;
}

::v-deep .el-dialog__body {
    padding-top: 0px;
    padding-bottom: 0px;
}

.el-aside {
    color: #333;
    border: solid #cccccc;
    border-width: 1px 0 1px 1px;
    background-color: #f5f5f5;
}

.el-menu {
    border: none;
    background-color: #f5f5f5;
}

.el-main {
    padding: 0;
}

::v-deep .emitem-nav .el-menu-item {
    height: 28px !important;
    line-height: 28px !important;
}</style>